<template>
	<view class="order">
		<u-navbar title="我的关注" :autoBack="true">
		</u-navbar>
		<view class="navlist">
			<view class="navmain">
				<view class="navitem" v-for="item in navlist" @click="changenav(item)">
					{{item.contentTypeName?item.contentTypeName:""}} <span v-if="item.count">({{item.count}})</span>
					<view class="navline" v-if="item.contentType==active">

					</view>
				</view>
			</view>

		</view>
		<view class="list" v-if="active==1">
			<view class="listmain" v-if="list.length>0"  v-for="item in list" @click="gohos(item)">
				<view class="listitem">
					<view class="iteml">
						<view class="hoslogo" v-if="item.logo">
	<image :src="item.logo" mode="aspectFit"></image>
						</view>
						<view class="hoslogo" v-if="!item.logo">
						<image src="../../../static/icons/hoslogo.png" mode="aspectFit"></image>
											</view>
						<view class="hosinfo">
							<view class="hosname">
								{{item.hosName}}
							</view>
							<view class="hoscon">
								{{item.hosTypeDesc}} {{item.hosLevelDesc}}
							</view>
						</view>
					</view>
					<view class="itemr">
						已关注
					</view>
				</view>
			</view>
	<view class="" v-if="list.length==0" style="text-align: center;height:100vh;padding-top: 100rpx;">
	   <image style="width: 300rpx;height: 200rpx;margin: 0 auto;margin-top: 30rpx;" src="../../../static/icons/wuping.png" mode="aspectFit"></image>
	   <p style="font-size: 24rpx; color: #737B80;margin-top: 10rpx;">暂无关注</p>
	</view>
		</view>
		<view class="list" v-if="active==2">
			<view class="listmain" v-if="list.length>0" v-for="item in list" @click="godep(item)" >
				<view class="listitem" >
					<view class="iteml">

						<view class="hosinfo">
							<view class="dep">
								<view class="depname">
									{{item.deptName}}
								</view> <view class="doctag" v-if="item.deptSignDesc">
									{{item.deptSignDesc?item.deptSignDesc:""}}
								</view>
							</view>
							<view class="hoscon">
								{{item.hosName}}
							</view>
						</view>
					</view>
					<view class="itemr">
						已关注
					</view>
				</view>
			</view>
		<view class="" v-if="list.length==0" style="text-align: center;height: 100vh;padding-top: 100rpx;">
		   <image style="width: 300rpx;height: 200rpx;margin: 0 auto;margin-top: 30rpx;" src="../../../static/icons/wuping.png" mode="aspectFit"></image>
		   <p style="font-size: 24rpx; color: #737B80;margin-top: 10rpx;">暂无关注</p>
		</view>
		</view>
		<view class="list" v-if="active==3">
			<view class="listmain" v-if="list.length>0"  v-for="item in list" @click="godoc(item)">
				<view class="listitem">
					<view class="iteml">
						<view class="hoslogo" v-if="item.logo">
		<!-- <image :src="item.logo" mode="aspectFit"></image> -->
		<u-avatar :src="item.logo" size="45" shape="circle" ></u-avatar>
						</view>
						<view class="hoslogo" v-if="!item.logo">
						<image src="../../../static/icons/yimo.png" mode="aspectFit"></image>
										</view>
						<view class="hosinfo">
							<view class="hosname">
								{{item.content}}
							</view>
							<view class="hoscon">
								{{item.hosName}}
							</view>
							<view class="hoscon">
								{{item.deptName}}
							</view>
							<view class="doctaglist">
								<view class="doctag" v-for="it in item.label">
								{{it}}
								</view>
								<!-- <view class="doctag1">
									国医妙手
								</view> -->
								
							</view>
						</view>
					</view>
					<view class="itemr">
						已关注
					</view>
				</view>
			</view>
			<view class="" v-if="list.length==0" style="text-align: center;height: 100vh; padding-top: 100rpx;">
			   <image style="width: 300rpx;height: 200rpx;margin: 0 auto;margin-top: 30rpx;" src="../../../static/icons/wuping.png" mode="aspectFit"></image>
			   <p style="font-size: 24rpx; color: #737B80;margin-top: 10rpx;">暂无关注</p>
			</view>
		</view>
		<view class="" v-if="list.length>0">
			<!-- <u-divider text="已经见底了~"></u-divider> -->
		</view>
	</view>
</template>

<script>
	import homeApi from '@/api/home'
	import urlApi from "@/setting.js"
	import homeApii from '@/api/homee'
	export default {
		data() {
			return {
				active: "3",
				token:"",
				navlist: [
				],
				pageNum:"1",
				pageSize:"10",
				list:[],
				total:"",
				totall:"",
				flag:false,
				code:""
			}
		},
onShow() {
	
},
		onLoad(option) {
			let token = uni.getStorageSync("token")
			// let token="123"
			if (token) {
				this.token = token
				this.getfollwtype()
			
			} else {
				this.gettoken()
			}
	wx.hideShareMenu({
			  success(res) {
			    console.log('success', res) // {success: true}
			  },
			  fail(err) {
			    console.log('fail', err)
			  }
			})
			
		},
	onReachBottom() {
		if(this.total==this.totall){
			
		}else{
			this.pageNum++;
			this.getfollow()	
		}
		
		},
		methods: {
			godoc(item){
				uni.navigateTo({
					url:"/pages/docinfo/docinfo?doctorId="+item.contentId
				})
			},
			godep(item){
				uni.navigateTo({
					url:"/pages/sousuo/search_dep_details/index?departmentId="+item.contentId
				})
			},
			gohos(item){
				uni.navigateTo({
					url:`/pages/sousuo/search_hosp_details/index?id=${item.contentId}`
				})
			},
             gettoken() {
				uni.removeStorageSync("token")
				uni.login({
					provider: 'weixin',
					success: (res) => {
						console.log(res)
						this.code = res.code
						// this.getopenid()
						const authCode = res.authCode;
						homeApii.getopenid({
							code: this.code
						}).then(res => {
							//console.log(res)
							if (res.code == 4000) {
								uni.setStorageSync("token", res.data.token)
								this.$store.state.doc.token = res.data.token
								this.token = res.data.token
								this.getfollow()
							}
						})
					},
				})
			},
			changenav(item) {
				// if(item.count=="0"){
				// 	uni.showToast({
				// 		title:"暂无关注"
				// 	})
				// }else{
					this.active = item.contentType
					this.list=[]
					this.total=""
					this.totall=""
					this.pageNum="1"
					this.getfollow()
				// }
				
			},
			getfollow(){
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				homeApi.getfollowlist({
					token:this.token,
					contentType:this.active,
					pageNum:this.pageNum,
					pageSize:this.pageSize
				}).then(res=>{
					this.total=res.data.total
					if(res.data.list.length != 0){
						res.data.list.forEach(el=>{
							let item = this.list.find(ele=>ele.contentId == el.contentId);
							if(!item){
								this.list.push(el)
							}
						})
					}
					uni.hideLoading()
						this.totall=this.list.length
						console.log(this.list,"456")
				})
			},
			
			getfollwtype(){
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				homeApi.getfollowtype({token:this.token}).then(res=>{
					console.log(res)
					uni.hideLoading() 
					
					this.navlist=res.data
				    let that=this
					this.navlist.some(function(element, index, array) {
					    if (element.count>0 ) {
							that.active=element.contentType
					        return true;
					    }
					})
					// this.active=res.data[0].contentType
					// this.navlist.forEach((el)=>{
					// 	if(el.count>0){
					// 		this.active=el.contentType
					// 		return
					// 	}
					// })
					this.list=[]
					this.getfollow()
				})
			}



		}
	}
</script>

<style scoped lang="scss">
	.order {
		background-color: #F5F6F8;
		padding-bottom: 20rpx;
		overflow: hidden;

		.list {
			width: 93%;
			margin: 0 auto;
			border-radius: 15rpx;
			padding-bottom: 20rpx;
			overflow: hidden;

			.listmain {
				width: 100%;
				margin: 0 auto;
				margin-top: 20rpx;
				border-radius: 15rpx;
				padding-top: 30rpx;
				padding-bottom: 30rpx;
				overflow: hidden;
				background-color: #fff;

				.listitem {
					width: 93%;
					margin: 0 auto;
					display: flex;
					justify-content: space-between;
					.iteml {
						display: flex;

						.hoslogo {
							width: 80rpx;
							height: 80rpx;
							border-radius: 50%;
							image{
								width: 100%;
								height: 100%;
								border-radius: 50%;
							}
						}

						.hosinfo {
							margin-left: 10rpx;

							.dep {
								display: flex;
                                flex-wrap: wrap;
								.depname{
									font-size: 32rpx;
									line-height: 60rpx;
								}
								.doctag {
									font-size: 20rpx;
									color: blue;
									background-color:#e8edff ;
									padding-left: 10rpx;
									padding-right: 10rpx;
									line-height: 30rpx;
									height: 30rpx;
									border-radius: 5rpx;
									margin-left: 10rpx;
									margin-top: 20rpx;
								}
							}

							.hosname {
								font-size: 30rpx;
							}

							.hoscon {
								font-size: 24rpx;
								margin-top: 10rpx;
								color: #888;
								line-height: 30rpx;
							}
							.doctaglist{
												   display: flex;
												   flex-wrap: wrap;
												   .doctag {
												   	font-size: 20rpx;
												   	color: #91562E;
												   	background-color: #FAD9A7;
												   	padding-left: 10rpx;
												   	padding-right: 10rpx;
												   	line-height: 35rpx;
													height: 35rpx;
												   	border-radius: 5rpx;
												   	margin-top: 10rpx;
													margin-right: 10rpx;
												   }
												   .doctag1 {
												   	font-size: 20rpx;
												   	color: #D06B00;
												   	background-color: #FFCFB5;
												   	padding-left: 10rpx;
												   	padding-right: 10rpx;
												   	line-height: 35rpx;
												   	border-radius: 5rpx;
												   	margin-top: 10rpx;
												   							margin-right: 10rpx;
												   }
											   }
						}
					}

					.itemr {
						width: 95rpx;
						height: 45rpx;
						border: 1rpx solid #888;
						color: #888;
						text-align: center;
						line-height: 45rpx;
						border-radius: 22.5rpx;
						font-size: 23rpx;
						margin-top: 15rpx;
					}
				}
			}

		}

		.navlist {
			width: 93%;
			margin: 0 auto;
			margin-top: 200rpx;
			border-radius: 15rpx;
			background-color: #fff;
			padding-top: 20rpx;
			padding-bottom: 20rpx;

			.navmain {
				width: 75%;
				margin: 0 auto;
				display: flex;
				justify-content: space-between;

				.navitem {
					width: 100rpx;
					height: 50rpx;
					line-height: 50rpx;
					font-size: 28rpx;
					text-align: center;

					.navline {
						width: 60%;
						margin: 0 auto;
						height: 3rpx;
						background-color: #417ef7;
					}
				}

			}

		}


	}
</style>
